import _ from 'lodash';
import loadjs from 'loadjs';
import { observable, action } from "mobx";
import { CHECKED, UNCHECKED } from '../../../../../constants/common';
import { LIB_PATH } from '../../../../../constants/form';
import {WeaLocaleProvider} from "ecCom";
const getLabel = WeaLocaleProvider.getLabel;

const UNSELECTED = '';

export default class AddressStore {
  @observable addressData = [];
  @observable province = '';
  @observable city = '';
  @observable district = '';
  @observable detail = '';
  @observable provinceOpts = [];
  @observable cityOpts = [];
  @observable districtOpts = [];
  @observable provinceRequired = CHECKED;
  @observable cityRequired = CHECKED;
  @observable districtRequired = CHECKED;
  @observable detailRequired = CHECKED;
  @observable errors = [];

  @action init(data) {
    if(!loadjs.isDefined('addressData')) {
      
      loadjs([`${LIB_PATH}/address/data.js`], 'addressData', {
        success: () => {
          this.initData(data);
        }
      });
    } else {
      loadjs.ready('addressData', () => {
        this.initData(data);
      });
    }
  }

  @action onDefaultValueChange(type, property, value) {
    if('required' === property) {
      this.onRequiredChange(type, value);
    } else if('value' === property) {
      this.onValueChange(type, value);
    }
  }

  onRequiredChange(type, value) {
    switch(type) {
      case 'province':
        this.onProvinceRequiredChange(value);
        break;
      case 'city':
        this.onCityRequiredChange(value);
        break;
      case 'district':
        this.onDistrictRequiredChange(value);
        break;
      case 'detail':
        this.onDetailRequiredChange(value);
    }
  }

  @action onValueChange(type, value) {
    switch(type) {
      case 'province':
        this.onProvinceChange(value);
        break;
      case 'city':
        this.onCityChange(value);
        break;
      case 'district':
        this.onDistrictChange(value);
        break;
      case 'detail':
        this.onDetailChange(value);
    }
  }

  onProvinceRequiredChange(value) {
    this.provinceRequired = value;

    this.validateRequired(0);
  }

  onCityRequiredChange(value) {
    this.cityRequired = value;

    this.validateRequired(1);
  }

  onDistrictRequiredChange(value) {
    this.districtRequired = value;

    this.validateRequired(2);
  }

  onDetailRequiredChange(value) {
    this.detailRequired = value;

    this.validateRequired(3);
  }

  onProvinceChange(value) {
    const provinceData = this.addressData.find(({ label }) => label === value);
    const { province, city, district } = this.getDefaultOpt();

    if(!provinceData) {
      this.province = province.key;
      this.initCityAndDistrict();
      this.validateRequired(0);
      return;
    }

    const citys = provinceData.children.map(this.optsMap);

    citys.unshift(city);

    this.province = value;
    this.cityOpts = citys;
    this.districtOpts = [district];
    this.city = city.key;
    this.district = district.key;
    this.validateRequired(0);
  }

  onCityChange(value) {
    const provinceData = this.addressData.find(({ label }) => label === this.province);

    if(!provinceData) {
      this.initCityAndDistrict();
      this.validateRequired(1);
      return;
    }

    const { district } = this.getDefaultOpt();
    const cityData = provinceData.children.find(({ label }) => label === value);

    this.city = value;

    if(!cityData) {
      this.initDistrict();
      this.validateRequired(1);
      return;
    }

    const districts = cityData.children.map(this.optsMap);

    districts.unshift(district);

    this.districtOpts = districts;
    this.district = district.key;
    this.validateRequired(1);
  }

  onDistrictChange(district) {
    this.district = district || UNSELECTED;
  }

  onDetailChange(detail) {
    this.detail = detail;
  }

  initState() {
    const { province } = this.getDefaultOpt();

    this.province = province.key;
    this.errors = [];
    this.provinceRequired = CHECKED;
    this.cityRequired = CHECKED;
    this.detailRequired = CHECKED;
    this.initCityAndDistrict();
  }

  initCityAndDistrict() {
    const { city } = this.getDefaultOpt();

    this.cityOpts = [city];
    this.city = city.key;
    this.initDistrict();
  }

  initDistrict() {
    const { district } = this.getDefaultOpt();

    this.districtOpts = [district];
    this.district = district.key;
  }

  optsMap(obj) {
    let label = obj;

    if (!_.isString(obj)) {
      label = obj.label;
    }

    return {
      key: label,
      showname: label,
      selected: false
    };
  }

  validateRequired(index) {
    const errors = [];

    if(UNCHECKED === this.provinceRequired &&
      UNCHECKED === this.cityRequired &&
      UNCHECKED === this.districtRequired &&
      UNCHECKED === this.detailRequired
    ) {
      errors[index] = getLabel('502452','请至少选择展示一个地址选项');
    } else if(UNCHECKED === this.provinceRequired && UNSELECTED === this.province &&
      (CHECKED === this.cityRequired || CHECKED === this.districtRequired)
    ) {
      errors[index] = getLabel('502453','请先选定省份');
    } else if(UNCHECKED === this.cityRequired && CHECKED === this.districtRequired) {
      errors[index] = getLabel('502454','勾选区/县之前请先勾选市');
    }

    this.errors = errors;
  }

  initData(data) {
    const addressData = window._addressData_;
    const defaultOpt = this.getDefaultOpt();
    const { province, city, district, detail } = data;
    const provinceOpts = [defaultOpt.province];

    addressData.forEach(province => {
      const { label } = province;

      provinceOpts.push({
        key: label,
        showname: label,
        selected: false
      });
    });

    this.addressData = addressData;
    this.provinceOpts = provinceOpts;
    this.onProvinceChange(province.value);
    this.onCityChange(city.value);
    this.onDistrictChange(district.value);
    this.onDetailChange(detail.value);
    this.onProvinceRequiredChange(province.required);
    this.onCityRequiredChange(city.required);
    this.onDistrictRequiredChange(district.required);
    this.onDetailRequiredChange(detail.required);
  }

  getDefaultOpt() {
    return {
      province: {
        key: UNSELECTED,
        showname: `- ${getLabel('502455','省/自治区/直辖市')} -`,
        selected: true
      },
      city: {
        key: UNSELECTED,
        showname: `- ${getLabel('502456','市区') } -`,
        selected: true
      },
      district: {
        key: UNSELECTED,
        showname: `- ${getLabel('502457','区/县')} -`,
        selected: true
      }
    };
  };
}